<template>
  <div class="rightbottomcontainer">
    <table border="0">
      <thead>
        <tr>
          <td>隐患级别</td>
          <td>隐患名称</td>
          <td>责任单位</td>
          <td>排查日期</td>
          <td>整改日期</td>
        </tr>
      </thead>
      <tbody>
        <tr style="border-bottom: 1px solid #fff">
          <td>一般燃风机标签脱落</td>
          <td>部分管道缺少标识</td>
          <td>配电室出入登记表缺失</td>
          <td>2021.1.25</td>
          <td>2021.1.26</td>
        </tr>
        <tr>
          <td>一般燃风机标签脱落</td>
          <td>部分管道缺少标识</td>
          <td>配电室出入登记表缺失</td>
          <td>2021.1.25</td>
          <td>2021.1.26</td>
        </tr>
        <tr>
          <td>一般燃风机标签脱落</td>
          <td>部分管道缺少标识</td>
          <td>配电室出入登记表缺失</td>
          <td>2021.1.25</td>
          <td>2021.1.26</td>
        </tr>
        <tr>
          <td>一般燃风机标签脱落</td>
          <td>部分管道缺少标识</td>
          <td>配电室出入登记表缺失</td>
          <td>2021.1.25</td>
          <td>2021.1.26</td>
        </tr>
      </tbody>
    </table>
  </div>
</template>
<script>
import { defineComponent } from "vue";
export default defineComponent({
  name: "RightBottom",
  setup() {
    return {};
  },
  mounted() {},
  methods: {},
});
</script>
<style lang="scss" scoped>
.rightbottomcontainer {
  padding: 16px;
}

table {
  color: #fff;
  white-space: nowrap;
  text-align: center;
  border-collapse: collapse;
  border-spacing: 0;
}

table tbody {
  display: block;
  height: 75px;
  overflow-x: hidden;
  overflow-y: scroll;
  font-size: 12px;
}

table tbody::-webkit-scrollbar-track {
  box-shadow: inset 0 0 6px rgb(255 255 255 / 0%);
}

table tbody::-webkit-scrollbar {
  width: 6px;
}

table tbody::-webkit-scrollbar-thumb {
  background-color: #f1ac58;
  border-radius: 30px;
  box-shadow: inset 0 0 6px rgb(0 0 0 / 30%);
}

table thead,
tbody tr {
  display: table;
  width: 100%;
  margin: 5px 0;
  table-layout: fixed;
}

table tbody tr td {
  width: 30px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

table thead {
  font-size: 12px;
  border-bottom: 1px solid #fff;
}
</style>
